import './App.css';
import {createContext, useContext, useEffect, useRef, useState} from "react";

function App() {

    let url = 'http://geek.itheima.net/v1_0/channels';

    const [list, setList] = useState([])
    /**
     * 组件渲染完成之后回调
     * deps 不同， 回调时机不同
     */
    useEffect(() => {
        async function getList(){
            let response = await fetch(url);
            let jsonRes = await response.json();
            console.log(jsonRes)
            setList(jsonRes.data.channels)
        }
        getList()
    }, []);

    return (
        <div>
            <ul>
                {list.map(item=>(
                    <li key={item.id}>{item.name}</li>
                ))}
            </ul>
        </div>
    )
}

export default App;